<script setup>
import { useI18n } from 'vue-i18n'
const { t } = useI18n()
import { ref, onMounted } from 'vue'
onMounted(()=>{
  if (navigator.userAgent.indexOf("waveshark") > -1) {
  let datatoken = "";
  if (/(iPhone|iPad|iPod|ios)/i.test(navigator.userAgent)) {
    this.$bridge.callhandler("getToken", "123", data => {
      datatoken = data;
      localStorage.setItem("usertoken", datatoken);
      this.$toast.clear();
    });
  } else if (/(android)/i.test(navigator.userAgent)) {
    datatoken = window.android.getToken();
    localStorage.setItem("usertoken", datatoken);
    this.$toast.clear();
  }
}
})
</script>

<template>
  <div class="app">
    <router-view v-slot="{ Component }">
      <transition name="fade" mode="out-in">
        <component :is="Component" />
      </transition>
    </router-view>
  </div>
</template>

<style>
html {
  font-size: 16px;
  background: #ffffff;
}

body {
  margin: 0;
  padding: 0;
  background: #ffffff;
}

.app {
  max-width: 750px;
  margin: 0 auto;
  min-height: 100vh;
  font-family: -apple-system, BlinkMacSystemFont, 'Helvetica Neue', Helvetica,
    Segoe UI, Arial, Roboto, 'PingFang SC', 'miui', 'Hiragino Sans GB', 'Microsoft Yahei',
    sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  color: var(--text-color);
  background: linear-gradient(135deg, var(--gradient-start), var(--gradient-end));
}

/* 移动端适配 */
@media screen and (max-width: 750px) {
  html {
    font-size: calc(100vw / 375 * 16);
  }
}

/* 主题色定义 */
:root {
  --primary-color: #00E5FF;
  --success-color: #00E5FF;
  --warning-color: #00E5FF;
  --danger-color: #FF5151;
  --info-color: #8F9BB3;
  --text-color: #FFFFFF;
  --text-color-secondary: rgba(255, 255, 255, 0.7);
  --border-color: rgba(255, 255, 255, 0.1);
  --background-color: #1E3B58;
  --card-background: rgba(16, 32, 58, 0.8);
  --gradient-start: #134074;
  --gradient-end: #0d7377;
  --text-color-dark: #333333;
  --text-color-secondary-dark: #666666;
}

/* 过渡动画 */
.fade-enter-active,
.fade-leave-active {
  transition: opacity 0.3s ease;
}

.fade-enter-from,
.fade-leave-to {
  opacity: 0;
}

/* 全局样式定义 */
.page-content {
  padding: 0.2rem;
}

.card {
  background: #fff;
  border-radius: 0.5rem;
  box-shadow: 0 2px 12px rgba(100, 101, 102, 0.08);
  overflow: hidden;
}

.section-title {
  font-size: 1.125rem;
  font-weight: 600;
  color: var(--text-color);
  margin: 1rem 0;
  padding-left: 0.5rem;
  border-left: 3px solid var(--primary-color);
}
.van-nav-bar__title{
  color: #fff;
}
</style>
